<template>
  <div>
    <navigation-bar customTitle="我的上传">
      <div class="searchContent">
        <!-- <el-input
					v-model="elementName"
					placeholder="请输入元件名称"
					size="mini"
					style="width: 150px; margin-right: 10px"
				></el-input>
				<el-select
					v-model="version"
					clearable
					placeholder="请选择版本"
					size="mini"
					style="width: 150px; margin-right: 10px"
				>
					<el-option
						v-for="item in versionList"
						:key="item.value"
						:label="item.label"
						:value="item.value"
						width="150px"
					>
					</el-option>
				</el-select>
				<el-select
					v-model="status"
					clearable
					placeholder="请选择状态"
					size="mini"
					style="width: 150px; margin-right: 10px"
				>
					<el-option
						v-for="item in statusList"
						:key="item.value"
						:label="item.label"
						:value="item.value"
						width="150px"
					>
					</el-option>
				</el-select>
				<custom-button
					type="search"
					style="margin-right: 10px"
					@searchClick="searchClick"
				></custom-button>
				<custom-button
					type="reset"
					style="margin-right: 10px"
					@resetClick="resetClick"
				></custom-button> -->
        &nbsp;
      </div>
    </navigation-bar>
    <table-index
      :dataSource="dataSource"
      :tableColumns="tableColumns"
      :btnList="btnList"
      :pageSize="pageSize"
      :pageCount="pageCount"
      :pageNo="pageNo"
      btnListWidth="70"
      @pageChange="pageChange"
      :height="secondTableHeight"
      @editRow="editRow"
      @viewRow="viewRow"
      @deleteRow="deleteRow"
      @downloadRow="downloadRow"
      @handleSelectionChange="handleSelectionChange"
    ></table-index>

    <div v-if="dialogShow">
      <custom-dialog
        :title="dialogTitle"
        size="large"
        @dialogClose="dialogClose"
      >
        <form-index
          :formConfig="formConfig"
          @submit="submit"
          :type="type"
          @formInputChange="formInputChange"
          ref="form"
        >
        </form-index>
      </custom-dialog>
    </div>

    <div v-if="showPwdJudge">
      <pwdJudge @close="showPwdJudge = false" @success="startDown"></pwdJudge>
    </div>
  </div>
</template>

<script>
import { tagManageForm } from "@/assets/form/managementCenter/tagManageForm";
import customDialog from "@/components/customComponents/customDialog";
// import customButton from "@/components/customComponents/customForm/customButton"
import formIndex from "@/components/customComponents/customForm/formIndex";
import tableIndex from "@/components/customComponents/customeTable/tableHeightIndex";
import navigationBar from "@/components/customComponents/managementCenter/navigationBar";
import { AjaxCommon } from "@/libs/apiCommon";
import { PopupCommon } from "@/libs/popupCommon";
import { SessionCommon } from "@/libs/sessionCommon";
import { Utility } from "@/libs/utility";
import pwdJudge from "@/components/customComponents/pwdJudge";
export default {
  components: {
    navigationBar,
    // customButton,
    tableIndex,
    customDialog,
    formIndex,
    pwdJudge,
  },
  data() {
    return {
      showPwdJudge: false,
      currentSelectDown: {}, // 存储当前点击的那行数据
      secondTableHeight: document.body.clientHeight - 150,
      version: "",
      versionList: [
        {
          value: "1",
          label: "版本1",
        },
        {
          value: "2",
          label: "版本2",
        },
      ],
      status: "",
      statusList: [
        {
          value: "1",
          label: "发布中",
        },
        {
          value: "2",
          label: "已发布",
        },
        {
          value: "3",
          label: "待发布",
        },
      ],

      selectItem: [],
      elementName: "",
      // table 相关参数  begin
      dataSource: [],
      tableColumns: [
        {
          prop: "FamilyName",
          label: "文件名称",
        },
        {
          prop: "Status",
          label: "文件状态",
          dictName: "FileStatus",
          class: "elementStatus",
        },
        {
          prop: "UploadTime",
          label: "上传时间",
        },
      ],
      btnList: ["download"],
      pageSize: 20,
      pageCount: 100,
      pageNo: 1,
      // table 相关参数  end

      // 弹窗是否显示
      dialogShow: false,
      // 弹窗标题 (新增修改不同)
      dialogTitle: "",

      // form的配置信息
      formConfig: tagManageForm,
      type: "add",
    };
  },
  methods: {
    startDown() {
      this.showPwdJudge = false;
      const item = this.currentSelectDown;
      this.downItem(item);
    },
    downloadRow(item) {
      var data = item.data;
      this.currentSelectDown = data;
      this.showPwdJudge = true;
    },
    stringToArrayBuffer(str) {
      console.log(str, "str....................");
      var buf = new ArrayBuffer(str.length);
      var bufView = new Uint8Array(buf);
      for (var i = 0, strLen = str.length; i < strLen; i++) {
        bufView[i] = str.charCodeAt(i);
      }
      return buf;
    },
    downItem(item) {
      // let self = this
      AjaxCommon(
        "/api/familyresouce/downloadfile/" + item.Id,
        "getBlob",
        null
      ).then((res) => {
        if (res?.status == 200) {
          Utility.oprRecord(3, item.Id);
          // var data = self.stringToArrayBuffer(res.data)
          var blob = new Blob([res.data]);
          const href = URL.createObjectURL(blob);
          const link = document.createElement("a");
          link.download = item.FamilyName;
          link.href = href;
          link.click();
          try {
            document.body.removeChild(link);
          } catch (error) {
            console.log(error.message);
          }
          URL.revokeObjectURL(href); // 释放内存
        } else {
          PopupCommon.notify("error", res?.data?.msg ?? "资源不存在");
        }
      });
    },
    deleteAll() {
      if (this.selectItem.length == 0) {
        PopupCommon.notify("info", "请先勾选数据");
        return;
      }
      PopupCommon.confirm("此操作将删除选择的数据, 是否继续?")
        .then(() => {
          // self.optReason = ""
          // self.dialogVisible = true
          // // optReason
          // const data = {
          // 	index: i,
          // 	data: d[i],
          // }
          // self.formData = data
          // // this.$emit("deleteRow", data)
          console.log(this.selectItem);
        })
        .catch(() => {
          // 这里尽量写下，否则会报警告异常。
          console.log("已取消删除");
        });
    },
    handleSelectionChange(d) {
      this.selectItem = d;
      console.log(d);
    },
    formInputChange(e) {
      // if (e.filedName == "idCard") {
      // 	const data = CardId.getInfoByCardId(e.value)
      // 	if (data) {
      // 		let newData = e.allData
      // 		newData["birthday"] = data.birthday
      // 		newData["sex"] = data.sex
      // 		this.$refs.form.changeFormValue(newData)
      // 	}
      // }
      console.log(e);
    },
    submit(d) {
      console.log(d);
      // let self = this
      // console.log(d)
      // if (d.id) {
      // 	AjaxCommon("/ccdc/cfg/device/device/edit", "post", d)
      // 		.then((res) => {
      // 			if (res.data.code == 200) {
      // 				PopupCommon.notify("success", "操作成功")
      // 				self.initPage()
      // 				self.dialogClose()
      // 				this.dialogClose()
      // 			} else {
      // 				PopupCommon.notify("error", res.data.message)
      // 			}
      // 		})
      // 		.catch((err) => {
      // 			PopupCommon.notify("error", err.message)
      // 		})
      // } else {
      // 	delete d.id
      // 	AjaxCommon("/ccdc/cfg/device/device/add", "post", d)
      // 		.then((res) => {
      // 			if (res.data.code == 200) {
      // 				PopupCommon.notify("success", "操作成功")
      // 				self.initPage()
      // 				self.dialogClose()
      // 			} else {
      // 				PopupCommon.notify("error", res.data.message)
      // 			}
      // 		})
      // 		.catch((err) => {
      // 			PopupCommon.notify("error", err.message)
      // 		})
      // }
    },
    dialogClose() {
      this.dialogShow = false;
    },
    searchClick() {
      this.pageNo = 1;
      this.initPage();
    },
    resetClick() {
      this.elementName = "";
    },
    addClick() {
      let formConfigItem = this.formConfig;
      formConfigItem.map((t) => {
        Object.keys(t).map((res) => {
          if (res == "fieldName") {
            t.filedValue = "";
          }
        });
      });
      this.formConfig = formConfigItem;
      this.type = "add";
      this.dialogShow = true;
      this.dialogTitle =
        "新增" + JSON.parse(SessionCommon.getCurrentMenuInfo()).title;
    },
    // 分页点击事件
    pageChange(p) {
      this.pageNo = p;
      this.initPage();
    },
    editRow(d) {
      this.type = "edit";
      let formConfigItem = this.formConfig;
      formConfigItem.map((t) => {
        Object.keys(t).map((res) => {
          if (res == "fieldName") {
            t.filedValue = d.data[t[res]];
          }
        });
      });
      this.formConfig = formConfigItem;
      this.dialogShow = true;
      this.dialogTitle =
        "编辑" + JSON.parse(SessionCommon.getCurrentMenuInfo()).title;
    },
    viewRow(d) {
      this.type = "look";
      let formConfigItem = this.formConfig;
      formConfigItem.map((t) => {
        Object.keys(t).map((res) => {
          if (res == "fieldName") {
            t.filedValue = d.data[t[res]];
          }
        });
      });
      this.formConfig = formConfigItem;
      this.dialogShow = true;
      this.dialogTitle =
        "查看" + JSON.parse(SessionCommon.getCurrentMenuInfo()).title;
    },
    deleteRow(d) {
      console.log(d);
      const id = d.data.id;
      let self = this;
      AjaxCommon("/ccdc/cfg/device/device/delete?id=" + id, "delete", {
        optReason: d.optReason,
      }).then((res) => {
        console.log(res, "res...............");
        if (res.data.code == 200) {
          PopupCommon.notify("success", "删除成功");
          self.initPage();
          self.dialogClose();
        } else {
          PopupCommon.notify("error", res.data.message);
        }
      });
    },
    // 初始化事件
    initPage() {
      // var dataValue = [
      // 	{
      // 		contents: "目录1",
      // 		elementName: "元件名称1",
      // 		version: "1",
      // 		elementStatus: "1",
      // 		flowStatus: "流程状态",
      // 		checkName: "审核人1",
      // 		uploadTime: "2024-02-03",
      // 		publishTime: "2024-02-03",
      // 		id: 1,
      // 	},
      // 	{
      // 		contents: "目录1",
      // 		elementName: "元件名称1",
      // 		version: "2",
      // 		elementStatus: "3",
      // 		flowStatus: "流程状态",
      // 		checkName: "审核人1",
      // 		uploadTime: "2024-02-03",
      // 		publishTime: "2024-02-03",
      // 		id: 2,
      // 	},
      // 	{
      // 		contents: "目录1",
      // 		elementName: "元件名称1",
      // 		version: "1",
      // 		elementStatus: "2",
      // 		flowStatus: "流程状态",
      // 		checkName: "审核人1",
      // 		uploadTime: "2024-02-03",
      // 		publishTime: "2024-02-03",
      // 		id: 3,
      // 	},
      // ]
      // this.dataSource = dataValue
      // this.pageCount = dataValue.length

      let self = this;
      AjaxCommon("/api/familyresouce/GetUploadFile", "get", {}).then((res) => {
        console.log(res, "res...........");
        if (res.status == 200) {
          self.dataSource = res.data.response;
        } else {
          PopupCommon.notify("error", res.data.msg);
        }
      });
    },
  },
  mounted() {
    this.$nextTick(() => {
      this.initPage();
    });
  },
};
</script>

<style>
.elementFBZ {
  background-color: #ebf4fe;
  border-radius: 6px;
  color: #439efe !important;
  padding: 5px 10px;
  font-size: 14px;
}

.elementYFB {
  background-color: #eff8ea;
  border-radius: 6px;
  color: #6ac25c !important;
  padding: 5px 10px;
  font-size: 14px;
}

.elementDFB {
  background-color: #f3f3f4;
  border-radius: 6px;
  color: #9897a8 !important;
  padding: 5px 10px;
  font-size: 14px;
}
</style>
